<template>
	<view>
		<uni-nav-bar shadow :fixed="true" left-icon="left" title="支付订单"  status-bar @clickLeft="back" :border="false"/>
		<view class="pay">
			<view class="info">
				<view class="">
					<text style="font-size: 28rpx; color: #666;">支付剩余时间</text>
					<uni-countdown :font-size="22" :show-day="false" :show-hour="false" :minute="minute" :second="second" />
				</view>
				<view class="">
					￥<text style="font-size: 70rpx; font-weight: 600;">{{order.orderAmount}}</text>
				</view>
				<view class="" style="font-size: 28rpx; color: #666; margin-top: 15rpx;">
					{{storeName}} - {{order.orderNumber}}
				</view>	
			</view>
			<view class="wechat">
				<view class="" style="margin: 15rpx; display: flex;justify-content: center;align-items: center;">
					<img src="../../static/wechat.png" alt="" style="width: 50rpx; height: 50rpx;" />
					<text style="margin-left: 25rpx;">微信支付</text>
				</view>
				<radio style="margin: 15rpx;" value="wechat" checked="true" color="#3C9CFF"/>
			</view>
			<view class="bt">
				<u-button type="primary" text="确认支付" @click="pay()"></u-button>
			</view>
		</view>
	</view>
</template>

<script>
import {payment} from '@/api/order.js'	
	export default {
		data() {
			return {
				storeName:this.$store.getters.storeInfo.name,
				order:{
					orderNumber:"999999999999",
					orderAmount:78,
					orderTime:'',
				},
				minute:15,
				second:0
			}
		},
		onLoad(option){
			const orderVO = JSON.parse(decodeURIComponent(option.orderVO));
			this.order = orderVO;
			let timestamp = Date.parse(new Date(orderVO.orderTime).toString());
			const nowTime = Date.parse(new Date())
			const Timeout = timestamp + 15*60*1000
			const newTime = (Timeout - nowTime)/1000
			
			this.second = newTime%60
			this.minute = parseInt(newTime/60)
			console.log('this.second',this.second)
			console.log('this.minute',this.minute)	
			
		},
		methods: {
			back() {
				this.$store.state.shoppingCartChange = !this.$store.state.shoppingCartChange
				this.$store.state.delivery = 0
				uni.navigateBack({
					delta: 1
				})
			},
			pay(){
				this.$store.state.shoppingCartChange = !this.$store.state.shoppingCartChange
				this.$store.state.delivery = 0
				const config = {
					  orderNumber: this.order.orderNumber,
					  payMethod: 0
				}
				payment(config).then(res=>{
					uni.navigateTo({
						url:"/pages/paySucceed/paySucceed?orderNumber=" + this.order.orderNumber
					})
				}).catch(err=>{
					uni.showToast({
						title:err
					})
				})

			}
		}
	}
</script>

<style scoped>
.pay{
	margin-top: 80rpx;
	display: flex;
	flex-direction: column;

	align-items: center;
}

.info{
	display: flex;
	flex-direction: column;
	align-items: center;
	height: 200rpx;
	justify-content: space-between;
}
.wechat{
	display: flex;
	justify-content: space-between;
	background: #fff;
	width: 98%;
	margin-left: 6rpx;
	height: 90rpx;
	margin-top: 75rpx;
}

.bt{
	width: 95%;
	margin-left: 6rpx; 
	position: fixed;
	bottom: 100rpx;
	/* margin-top: 650rpx; */
}
</style>
